import elementResizeDetectorMaker from 'element-resize-detector'

const erd = elementResizeDetectorMaker()

export default {
  beforeDestroy () {
    this.unbindResizeHandler()
  },
  mounted () {
    this.bindResizeHandler()
  },
  methods: {
    bindResizeHandler () {
      const container = this.$refs.container
      const chart = this.$refs.chart
      if (container && chart) {
        erd.listenTo(container, () => {
          chart.resize({
            animation: {
              duration: 1000,
            }
          })
        })
      }
    },
    unbindResizeHandler () {
      const container = this.$refs.container
      if (container) {
        erd.removeAllListeners(container)
      }
    },
  },
}
